<template>
  <div class="content-item">
    <p>
      <el-input v-model="queryParams.key"
                style="width: 200px;margin-bottom: 10px;"
                placeholder="请输入学号或姓名"
                size="small"></el-input>
      <el-button type="primary"
                 size="small"
                 @click="query()">搜索</el-button>
    </p>
    <TabList :tabData="tabData"
             class=" table-header-gray"
             :specCol="specCol"
             :columns="columns"></TabList>
    <pagenation :dataLength="total"
                :page="queryParams.page"
                :pageSize="queryParams.size"
                :handleSizeChange="handleSizeChange"
                :handleCurrentChange="handleCurrentChange" />
  </div>
</template>
<script>
import { pagination } from '@/tools/mixin'
import {
  listSettingConfigResultUsingPOST
} from '@api/auto'
export default {
  mixins: [pagination],
  data () {
    return {
      editRow: {},
      queryParams: {
        key: '',
        page: 1,
        size: 10,
        id: null
      },
      total: 0,
      tabData: [],
      columns: [
        { label: '学号', prop: 'sn' },
        { label: '姓名', prop: 'name' },
        { label: '性别', prop: 'gender' },
        { label: '学生类型', prop: 'objectOrientedName' },
        { label: '学院', prop: 'collegeName' },
        { label: '专业', prop: 'majorName' },
        { label: '年级', prop: 'gradeName' },
        { label: '班级', prop: 'className' },
        { label: '调宿结果', prop: 'checkInInfo' }
      ],
      specCol: [{ label: '性别',
        prop: 'gender',
        tem: `<span>{{$transSex(gender)}}</span>` }]
    }
  },
  created () {
    this.queryParams.id = JSON.parse(sessionStorage.editRow).id
    this.query()
  },
  methods: {
    query (pageNum = 1) {
      this.queryParams.page = pageNum
      listSettingConfigResultUsingPOST(this.queryParams).then(res => {
        this.tabData = res.data ? res.data.list : []
        this.total = res.data ? res.data.total : 0
      })
    }
  }
}
</script>
